<template>
  <div class="lx">
    <am-header />
    <div class="center">
		
      <el-container>
        <el-aside width="130px" style="height: 90vh; border: 1px solid #eee">
          <el-menu>
            <el-menu-item index="1" style="border: 1px solid #eee">关注的房源</el-menu-item>
            <el-menu-item index="2" style="border: 1px solid #eee">关注的小区</el-menu-item>
            <el-menu-item index="3" style="border: 1px solid #eee">我的经纪人</el-menu-item>
            <el-menu-item index="4" style="border: 1px solid #eee">看房记录</el-menu-item>
            <el-menu-item index="5" style="border: 1px solid #eee">我的委托</el-menu-item>
            <el-menu-item index="6" style="border: 1px solid #eee">我的问答</el-menu-item>
            <el-menu-item index="7" style="border: 1px solid #eee">编辑资料</el-menu-item>
          </el-menu>
        </el-aside>
        <el-main>
			<p>共0套 关注房源</p>
          <el-menu
            :default-active="activeIndex"
            class="el-menu-demo"
            mode="horizontal"
            @select="handleSelect"
          >
            <el-menu-item index="1">二手房</el-menu-item>
            <el-menu-item index="2">新房</el-menu-item>
            <el-menu-item index="3">租房</el-menu-item>
          </el-menu>
          <el-empty description="还没有关注任何房源哦">
            <el-button type="primary">添加房源</el-button>
          </el-empty>
        </el-main>
      </el-container>
    </div>
    <am-footer />
  </div>
</template>

<script>
import AmHeader from "@/components/AmHeader.vue";
import AmFooter from "@/components/AmFooter.vue";
export default {
  components: { AmHeader, AmFooter },
  data() {
      return {
        activeIndex: '1',
        activeIndex2: '1'
      };
    },
    methods: {
      handleSelect(key, keyPath) {
        console.log(key, keyPath);
      }
    }
};
</script>

<style lang="scss" scoped>
.center {
  width: 1380px;
  height: 95vh;

  margin: 0 auto;
}
.el-header {
  background-color: #b3c0d1;
  color: #333;
  line-height: 60px;
}

.el-aside {
  color: #333;
}
</style>